<template>
	<div class="basicMsg" >
		<tab active-color='#2269ff'>
	      <tab-item @on-item-click="$router.push({path:'basicMessageDetail',query:{id:param.data.id}})">基本信息</tab-item>
	      <tab-item @on-item-click="$router.push({path:'idCardMessage',query:{id:param.data.id}})">证件信息</tab-item>
	      <!--<tab-item selected @on-item-click="$router.push('trainMessage')"><i>培训信息</i></tab-item>-->
	      <tab-item @on-item-click="$router.push({path:'breakMessage',query:{id:param.data.id}})">违章信息</tab-item>
        <tab-item @on-item-click="$router.push({path:'healthMessage',query:{id:param.data.id}})">职业健康</tab-item>
	    </tab>
		<dl @click="$router.push('trainMessageDetail')">
			<dt>培训名称: 班组级安全培训</dt>
			<dd>成绩: <i class="color1">95分</i></dd>
		</dl>
		<dl @click="$router.push('trainMessageDetail')">
			<dt>培训名称: 班组级安全培训</dt>
			<dd>成绩: <i class="color2">60分</i></dd>
		</dl>
    <myMenu></myMenu>
	</div>
</template>
<script type="text/javascript">
	import { Tab, TabItem } from 'vux'
  import myMenu from '@/commonComponents/menu'


  export default {
		components: {
		    Tab,
		    TabItem,
      myMenu
		},
		data(){
			return{
        param:{
          allowPaging:true,
          data:{
            id:'1930118106'
          },
          pageIndex:0,
          pageSize:20
        }
			}
		},
    created(){
      this.param.data.id=this.$route.query.id
    },
		methods:{

		}
	}
</script>
<style lang="less" scoped>
@import '~vux/src/styles/1px.less';
@import '~vux/src/styles/center.less';
.basicMsg{
	.vux-tab-selected{
		i{
			font-size: 15px;
			color: #2269ff;
			font-weight: bold;
		}
	}
	> dl{
		height: 80px;
		border-bottom: 1px solid #f0f0f2;
		font-size: 12px;
		margin-left: 20px;
		overflow: hidden;
		background: url(../../../../static/images/index/more3.png)no-repeat right 20px center;
		background-size: 6px 10px;
		dt{
			font-weight: bold;
			color: #343434;
			margin:20px 0 13px 0;
		}
		dd{
			color: #8d8d8d;
			.color1{
				color:#11bd81;
			}
			.color2{
				color:#fe0000;
			}

		}
	}
}
</style>
